<!-- pages/login/login.vue -->
<script setup lang="ts">
	import { reactive } from 'vue';
	import { useUserStore } from '@/store/user';
	import api from '@/api';

	const form = reactive({
		account: '',
		password: '',
	});

	const userStore = useUserStore();


	// 登录函数（用 async/await）
	const handleLogin = async () => {
		if (!form.account || !form.password) {
			uni.showToast({ title: '请输入账号密码', icon: 'none' });
			return;
		}
		try {
			// 直接调用 this.$api.loginApi（await 等待请求完成）
			const res = await api.login({
				account: form.account,
				password: form.password,
			});
			// 登录成功：保存用户信息
			await userStore.login(res.data.userinfo);
			// 跳转到首页
		} catch (error : any) {
			// 处理错误（比如账号密码错、网络问题）
			uni.showToast({ title: error.msg, icon: 'none' });
		}
	};
</script>

<template>
	<view class="container">
		<view>
			<input v-model="form.account" placeholder="用户名" />
			<input v-model="form.password" placeholder="密码" type="password" />
			<button @click="handleLogin">登录</button>
			<view>{{JSON.stringify(userStore.userinfo)}}</view>
		</view>
		
	</view>
</template>
<style scoped>
	.container {
		padding: 20px;
	}

	input {
		border: 1px solid #eee;
		padding: 10px;
		margin-bottom: 15px;
		border-radius: 4px;
	}

	button {
		background-color: #007aff;
		color: white;
		padding: 10px;
		border-radius: 4px;
	}
</style>